import request from '../../until/request'
Page({
  // 点击跳转致搜索页面
  toSearchPage() {
    wx.navigateTo({
      url: '/pages/search/search',
    })
  },
  // 封装获取导航栏列表的函数
  async getNavList() {
    const res = await request({
      url: '/video/group/list'
    })
    if (res.code === 200) {
      this.setData({
        navList: res.data.slice(0, 15),
        navId: res.data[0].id
      })
      // 获取导航栏对应的视频
      this.getCheckedVideoList()
    }
  },
  // 封装获取某一个导航的视频的函数
  async getCheckedVideoList() {
    const res = await request({
      url: '/video/group',
      data: {
        id: this.data.navId
      }
    })
    if (res.code === 200) {
      this.setData({
        checkedVideoList: res.datas,
        isTriggered:false
      })
    }
  },
  // 手指点击导航栏选中某个导航
  selectedNav(e) {
    // 改变navId
    this.setData({
      navId: e.target.dataset.id
    })
    // 获取新的视频
    this.getCheckedVideoList()
  },
  // 点击某个视频播放或暂停,只能有一个视频进行播放
  handlerPlayOrPause(e) {
    // console.log(e);
    // 拿到当前点击的那个视频的id
    const videoId = e.target.id
    // 存储videoId  存储当前点击的那个视频的标识符
    this.setData({
      videoId,
    })
    // 分两种情况 1.第一次点击播放  2.再次点击
    // 第一次点击的时候还没有创建视频的执行上下文
    if (!this.player) {//第一次点击
      this.player = wx.createVideoContext(this.data.videoId)
      this.player.play()
      // 保存这个视频的播放状态
      this.status = true
      // 保存当前播放的视频id  用于后面判断再次点击的时候是否是点击的同一个视频
      this.vid = this.data.videoId
    } else {//再次点击
      if (this.data.videoId === this.vid) {//点击的是同一个视频 this.player依旧还是当前这个视频对象
        // 判断这个视频的播放状态，根据状态来确定是播放还是暂停
        this.status ? this.player.pause() : this.player.play()
        // 更改这个视频的播放状态
        this.status = !this.status
      } else {//点击的是其他的视频，需要暂停前一个视频
        // 此时的this.player依旧是上一个视频的执行上下文
        this.player.pause()
        // 传入新的视频id创建新的执行上下文覆盖之前的
        this.player = wx.createVideoContext(this.data.videoId)
        // 查找记录里面是否有这条视频的播放记录
        const currentViedo = this.data.recordList.find(item=>item.vid===this.data.videoId)
        // 如果currentVideo存在，则证明之前播放过，有播放记录，那么就要将播放时间调整为之前记录的时间
        // 调用seek函数跳转到之前播放的那个时间位置
        currentViedo && this.player.seek(currentViedo.time)
        this.player.play()
        // 保存这个视频的播放状态
        this.status = true
        // 保存当前播放的视频id  用于后面判断再次点击的时候是否是点击的同一个视频
        this.vid = this.data.videoId
      }
    }
  },

  // 监控视频播放,可以接收到一个视频对象，里面有播放时间
  handlerVideoTime(event) {
    // 先判断记录中有没有这个视频
    const recordList = this.data.recordList
    const item = recordList.find(item => item.vid === event.target.id)
    if (item) {//证明记录中有这个视频播放记录
      item.time = event.detail.currentTime
    } else {//记录中没有这个视频播放记录
      // 获取这个视频的id和播放时间
      const video = {
        vid: event.target.id,
        time: event.detail.currentTime
      }
      // 将这个对象存储到data中
        recordList.push(video)
    }
    // 更新data中的recordList
    this.setData({
      recordList
    })
  },

  // 视频播放完需要从记录中删除，不然下次播放就是播放完的状态
  clearVideoTime(){
    console.log('播完啦');
    // 当视频播放完的时候data中存储的videoId就是当前播放的那个视频的id
    let recordList = this.data.recordList
    // 找到这个视频在recordList数组中的索引
    let index = recordList.findIndex(item=>item.vid===this.data.videoId)
    console.log(index);
    // 删除这个视频的记录
    recordList.splice(index,1)
    // 更新data数据
    this.setData({
      recordList
    })
  },

  // 下拉刷新
  fresh(){
    this.setData({
      isTriggered:true
    })
    this.getCheckedVideoList()
  },

  // 上拉加载更多
  loadingMore(){
    console.log('11');
    let checkedVideoList = this.data.checkedVideoList
    if(checkedVideoList.length > 20){
      console.log('222');
      wx.showToast({
        title: '已经到底了',
        icon: 'none',
      })
      return
    }
    this.setData({
      checkedVideoList:[...checkedVideoList,...checkedVideoList]
    })
  },

  /* 页面的初始数据*/
  data: {
    navList: [],
    navId: 0,
    checkedVideoList: [],
    videoId: 0,
    recordList: [],
    isTriggered:false
  },

  /* 生命周期函数--监听页面加载 */
  onLoad(options) {
    // 获取导航栏列表数据
    this.getNavList()
  },

  /**
   * 生命周期函数--监听页面初次渲染完成
   */
  onReady() {

  },

  /**
   * 生命周期函数--监听页面显示
   */
  onShow() {

  },

  /**
   * 生命周期函数--监听页面隐藏
   */
  onHide() {

  },

  /**
   * 生命周期函数--监听页面卸载
   */
  onUnload() {

  },

  /**
   * 页面相关事件处理函数--监听用户下拉动作
   */
  onPullDownRefresh() {

  },

  /**
   * 页面上拉触底事件的处理函数
   */
  onReachBottom() {

  },

  /**
   * 用户点击右上角分享
   */
  onShareAppMessage({from}) {
    // 可能是点击评论的三个点按钮，也可能是点击的右上角三个点分享
    if(from==='button'){//点击评论的三个点按钮
      return {
        title:'来自评论分享',
        path:'/pages/home/home',
        imageUrl:'/static/images/personal/bgImg.jpg',
      }
    }else{//点击的右上角三个点分享
      return {
        title:'来自右上角分享',
        path:'/pages/login/login',
        imageUrl:'/static/images/personal/bgImg2.jpg',
      }
    }
  }
})